<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
    <script>
        window.onload = function() {
            const app = Vue.createApp({
                setup() {
                    let inputType = 'text';
                    let headLine = 'hello vue3';
                    let article = 'vue is awesome';
                    let colorStyle = {'color':'red'};
                    let colorStyle2 = {'background-color':'yellow'};

                    return{
                        inputType, headLine, article, colorStyle, colorStyle2
                    }
                }
            });
            app.mount("#app")
        }
        
    </script>
</head>
<body>
    

    <div id = 'app'>
        <h1 v-bind:style="colorStyle2">{{headLine}}</h1>
    </div>

    
</body>
</html>